<template>
  <div class="about">
    <header>基本信息</header>

    <el-row>
      <el-col :span="12">
        <div class="grid-content bg-purple">
          <span class="one">登录名称：</span>
          <span>{{this.form.userInfo.username}}</span>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="grid-content bg-purple-light">
          <span class="one">用户全名：</span>
          <span>{{this.form.userInfo.fullname}}</span>
        </div>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="12">
        <div class="grid-content bg-purple">
          <span class="one">学号：</span>
          <span>{{this.form.userInfo.number}}</span>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="grid-content bg-purple-light">
          <span class="one">用户编号：</span>
          <span>{{this.form.userInfo.id}}</span>
        </div>
      </el-col>
    </el-row>
  </div>
</template>


<script>
import bus from "../plugins/bus";

export default {
  data() {
    return {
      form: {
        userInfo: {},
      },
    };
  },

  created() {
    this.getUserInfo();
  },

  methods: {
    // 获取教学楼
    getUserInfo() {
      this.$axios({
        url: "/api/userInforQ",
        method: "post",
        data: {
          id: String(JSON.parse(sessionStorage.getItem("userInfo")).id),
        },
      }).then((res) => {
        if (res._RejCode === "00000000") {
          this.form.userInfo = res.userInfor[0];
        }
      });
    },
  },
};
</script>
<style  scoped>
.about {
  margin: 0 auto;
  border: 1px solid rgba(83, 83, 83, 0.333);
  width: 80%;
  padding: 30px;
}

header {
  height: 44px;
  line-height: 44px;
  /* background: #c2c1c1; */
  text-align: left;
  padding: 0 0 0 26px;
  margin: 0;
}
.el-row {
  padding: 20px 30px 0px 30px;
}
.one {
  color: hsla(0, 0%, 40%, 0.647059);
  margin-right: 10px;
}
</style>
